<template>
  <div style="overflow-x: hidden;">
    <validator name='v'>
      <form novalidate class="form-horizontal">
        <caption><h3 style="font-weight:bold; text-align:center;">用户表添加</h3></caption>

        <div class="form-group">
          <label for="f_card_id" class="col-sm-offset-1 col-sm-1 control-label">卡号:</label>
          <div class="col-sm-2">
              <input class="form-control" type="text" v-model="model.f_card_id"
              v-validate:f_card_id='{ required: true }' placeholder="卡号不能为空">
          </div>

          <label for="f_meter_no" class="col-sm-1 control-label">表号:</label>
          <div class="col-sm-2">
             <input class="form-control" type="text" v-model="model.f_meter_no"
             v-validate:f_meter_no='{ required: true }' placeholder="表号不能为空">
          </div>
           <label for="f_meter_brand" class="col-sm-1 control-label">表牌:</label>
           <div class="col-sm-2">
              <!-- <input class="form-control" type="text" v-model="model.f_meter_brand" > -->

              <v-select id="f_meter_brand"
              placeholder='请选择'
              :value.sync="f_meter_brand"
              :options='f_meterbrand'
              close-on-select clear-button></v-select>
            </div>
          </div>

          <div class="form-group">
            <label for="f_meter_measurement" class="col-sm-offset-1 col-sm-1 control-label">计量类型:</label>
            <div class="col-sm-2">
                <!-- <input class="form-control" type="text" v-model="model.f_meter_measurement" > -->
                <v-select id="f_meter_measurement"
                placeholder='请选择'
                :value.sync="f_meter_measurement"
                :options='f_metermeasurement'
                close-on-select clear-button></v-select>
            </div>

            <label for="f_meter_diameter" class="col-sm-1 control-label">表径:</label>
            <div class="col-sm-2">
              <v-select id="f_meter_diameter"
              placeholder='请选择'
              :value.sync="f_meter_diameter"
              :options='f_meterdiameter'
              close-on-select clear-button></v-select>
            </div>
             <label for="f_meter_reading" class="col-sm-1 control-label">机表读数:</label>
             <div class="col-sm-2">
               <input class="form-control" type="text" v-model="model.f_meter_reading" number
               onkeyup="this.value=this.value.replace(/\D/g,'')"
               onafterpaste="this.value=this.value.replace(/\D/g,'')"
               v-validate:f_meter_reading='{ required: true }'
               placeholder='机表读数，只能输入数字'>
              </div>
            </div>

          <div class="form-group">
             <label for="f_meter_remain" class="col-sm-offset-1 col-sm-1 control-label">剩余气量:</label>
             <div class="col-sm-2">
                <input class="form-control" type="text" v-model="model.f_meter_remain" number
                onkeyup="this.value=this.value.replace(/\D/g,'')"
                onafterpaste="this.value=this.value.replace(/\D/g,'')"
                v-validate:f_meter_remain='{ required: true }'
                placeholder='剩余气量，只能输入数字'>
             </div>
             <label for="f_meter_total" class="col-sm-1 control-label">总气量:</label>
              <div class="col-sm-2">
                 <input class="form-control" type="text" v-model="model.f_meter_total"
                 onkeyup="this.value=this.value.replace(/\D/g,'')"
                 onafterpaste="this.value=this.value.replace(/\D/g,'')"
                 v-validate:f_meter_total='{ required: true }'
                 placeholder='总气量，只能输入数字'>
              </div>

              <label for="f_meter_accumulation" class="col-sm-1 control-label">累计购气:</label>
              <div class="col-sm-2">
                <input class="form-control" type="text" v-model="model.f_meter_accumulation"、
                onkeyup="this.value=this.value.replace(/\D/g,'')"
                onafterpaste="this.value=this.value.replace(/\D/g,'')"
                v-validate:f_meter_accumulation='{ required: true }'
                placeholder='累购，只能输入数字'>
              </div>
            </div>

            <div class="form-group">
               <label for="f_remark" class="col-sm-offset-1 col-sm-1 control-label">备注:</label>
               <div class="col-sm-2">
                  <input class="form-control" type="text" v-model="model.f_remark"placeholder='备注'>
               </div>
              </div>

          </form>
          <div style="text-align:center;height:auto;">
            <button class="btn btn-success" :disabled='!($v.valid)' @click="modify()" style="width:100px;margin-left:20px;">
              <span class="glyphicon glyphicon-cog"></span>保存
            </button>
            <button class="btn btn-default"  @click='$back()' style="width:100px;margin-left:20px;">
              <span class="glyphicon glyphicon-log-out"></span>返回
            </button>
          </div>
    </validator>
  </div>
</template>
<script>
import co from 'co'
import AppData from '../../stores/AppData'
let info = function * (self) {
  if (self.flag === 1) {
    self.model.f_meter_diameter = self.f_meter_diameter[0]
    self.model.f_meter_brand = self.f_meter_brand[0]
    self.model.f_meter_measurement = self.f_meter_measurement[0]
    self.model.f_user_id = self.row.f_user_id
    self.model.f_userfile_id = self.row.id
    console.log('拿到的表记录', JSON.stringify(self.model))
    self.$back(self.model)
  } else {
    self.model.f_meter_diameter = self.f_meter_diameter[0]
    self.model.f_meter_brand = self.f_meter_brand[0]
    self.model.f_meter_measurement = self.f_meter_measurement[0]
    self.$back(self.model)
  }
}

export default {
  title: '表修改',
  props: ['row', 'flag'],
  data () {
    return {
      model: {},
      addmeter: {},
      f_meter_diameter: [''],
      // f_meterdiameter: this.$getParams('表径', [{label: '请选择', value: ''}]),
      f_meter_brand: [''],
      // f_meterbrand: this.$getParams('燃气表品牌', [{label: '请选择', value: ''}]),
      f_meter_measurement: ['']
      // f_metermeasurement: this.$getParams('计量类型', [{label: '请选择', value: ''}])

    }
  },
  computed: {
    f_meterbrand () {
      return [{label: '全部', value: ''}, ...AppData.getParam('燃气表品牌')]
    },
    f_metermeasurement () {
      return [{label: '全部', value: ''}, ...AppData.getParam('计量类型')]
    },
    f_meterdiameter () {
      return [{label: '全部', value: ''}, ...AppData.getParam('表径')]
    }
  },
  methods: {
    modify () {
      if (this.f_meter_diameter[0] === '') {
        window.alert('请选择表径')
        return
      }
      if (this.f_meter_brand[0] === '') {
        window.alert('请选择表牌')
        return
      }
      if (this.f_meter_measurement[0] === '') {
        window.alert('请选择计量类型')
        return
      }
      let gen = info(this)
      return co(gen)
    }
  }
  // computed: {
  //   show () {
  //     if (this.f_meter_diameter[0] $$ )
  //   }
  // }
}
</script>
